<template>
  <el-dialog v-model="visible" title="视频播放" @close="onClose">
    <video
      v-if="visible"
      id="myVideo"
      ref="videoRef"
      controls
      style="width: 100%"
      class="video-js"
      :src="videoUrl"
    />
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, onMounted, nextTick } from "vue";

const visible = ref(false);
const videoUrl = ref("");
const videoRef = ref(null);

const show = (data = null) => {
  videoUrl.value = data?.warnUrl || "";
  visible.value = true;
};
defineExpose({ show });

const onClose = () => {
  videoRef.value.pause();
};
</script>
